<!DOCTYPE HTML>
<html lang="zh-CN">
<head><meta name="generator" content="Hexo 3.9.0">
    <!--Setting-->
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <meta http-equiv="Cache-Control" content="no-siteapp">
    <meta http-equiv="Cache-Control" content="no-transform">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta name="apple-mobile-web-app-capable" content="LG的博客">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no,email=no,adress=no">
    <meta name="browsermode" content="application">
    <meta name="screen-orientation" content="portrait">
    <meta name="theme-version" content="1.2.3">
    <meta name="root" content="/">
    <!--SEO-->
    <meta name="keywords" content="LG,Spring Cloud,Docker,微服务架构,Spring Boot,经验分享,软件代做,毕业设计,博客建站">
    <meta name="description" content="Spring Cloud、Docker、微服务架构、Cloud Native相关知识分享、LG的博客,毕业设计代做">
    <meta name="robots" content="all">
    <meta name="google" content="all">
    <meta name="googlebot" content="all">
    <meta name="verify" content="all">
    <!--Title-->
    <title> LG的博客</title>
    <link rel="alternate" href="#" title="LG的博客" >
    <link rel="icon" href="static/picture/favicon2.png">
    <link rel="stylesheet" href="static/css/bootstrap.min.css">
    <link rel="stylesheet" href="static/css/jquery.fancybox.css">
    <link rel="stylesheet" href="static/css/font-awesome.min.css">
    <link rel="stylesheet" href="static/css/style.css">

    <script>
        var _hmt = _hmt || [];
        (function() {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?04983d21727b02deb6771184cf02f865";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script>

    <style>
        /*设置高度*/
        .post-content {
            height: 180px;
        }
    </style>

</head>

</html>
<!--[if lte IE 8]>
<style>
    html{ font-size: 1em }
</style>
<![endif]-->
<!--[if lte IE 9]>
<div style="ie">你使用的浏览器版本过低，为了你更好的阅读体验，请更新浏览器的版本或者使用其他现代浏览器，比如Chrome、Firefox、Safari等。</div>
<![endif]-->

<body>
<div id="app">
    <nav class="main-navigation">
        <div class="container">
            <div class="row clearfix">
                <div class="col-md-12 column">
                    <nav class="navbar navbar-default" style="background-color:#fff;border:0;margin-bottom:0"
                         role="navigation">
                        <div class="navbar-header">
                            <button type="button" class="navbar-toggle" data-toggle="collapse"
                                    data-target="#navbar-collapse-1">
                                <span class="sr-only">切</span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                            </button>
                            <a class="logo" href="index.html">
                                <img src="static/picture/favicon2.png"/>LG的博客
                            </a>
                        </div>

                        <div class="collapse navbar-collapse" style="border:0;" id="navbar-collapse-1">
                            <ul class="nav navbar-nav">

                                <li>
                                    <a href="index.html" >
                                        <i class="fa fa-home"></i>
                                        首页
                                    </a>
                                </li>

                                <li>
                                    <a target="_blank" href="archives.html" >
                                        <i class="fa fa-sort"></i>
                                        归档
                                    </a>
                                </li>

                                <li class="dropdown">
                                    <a href="#" class="dropdown-toggle" data-toggle="dropdown"
                                       data-hover="dropdown">
                                        <i class="fa fa-fire"></i>
                                        文章分类
                                        <strong class="caret"></strong>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li v-for="(typeStatistics, i) in articleTypeStatistics">
                                            <a :href="'blogsort.html?' + typeStatistics.id + '###' + typeStatistics.typeName" target="_blank">
                                                <i class="fa "></i>{{typeStatistics.typeName}}({{typeStatistics.count}})
                                            </a>
                                        </li>
                                    </ul>
                                </li>
                                <li>
                                    <a target="_blank" href="about.html" >
                                        <i class="fa fa-user"></i>
                                        关于我
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </nav>
                </div>
            </div>
        </div>
    </nav>

    <a href="https://gitee.com/colinWu_java/interview" target="_blank">
        <img style="position: absolute; width:100px; top: 0; left: 0; border: 0;"
             src="static/picture/fork-me.png"
             alt="Fork me on GitHub">
    </a>

    <section class="content-wrap">
        <div class="container">
            <div class="row">
                <main class="col-md-8 main-content ">
                    <div id="main">
                        <div class="timebox">
                            <div class="timeline">
                                <ul v-for="(article, i) in articleList">
                                    <h2>
                                        {{article.year}}
                                    </h2>
                                    <li v-for="(articleObj, i) in article.articleList">
                                        <h3>
                                            {{articleObj.day}}<span>{{articleObj.month}}</span>
                                        </h3>
                                        <a :href="'blogdetail.html?' + articleObj.id" target="_blank">
                                            {{articleObj.articleName}}
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </main>

                <aside class="col-md-4 sidebar">

                    <div class="widget about-me">
                        <div class="row">
                            <div class="col-md-5">
                                <img src="./static/picture/My.jpg" alt="微信号" class="img-responsive center-block">
                            </div>
                            <div class="col-md-7" style="margin-top: 20px;">
                                <ul>
                                    <li>• 技术干货分享</li>
                                    <li>• 免费资料领取</li>
                                    <li><b>• 扫码领取更多惊喜</b></li>
                                </ul>
                            </div>
                        </div>
                    </div>

                    <div class="widget">
                        <h3 class="title">社交</h3>
                        <div class="notification">
                            <p>
                                <b>QQ</b>：1714423709<br/>
                                <b>邮箱</b>：1714423709@qq.com<br/>
                            </p>
                        </div>
                    </div>

                    <div class="ad">
                        <div class="row">
                            <div class="col-md-12">
                                <a :href="paramObj.ad_url" rel="nofollow" target="_blank">
                                    <img class="img-responsive center-block"
                                         title="阿里云活动"
                                         :src="paramObj.ad_1001_url"
                                    >
                                </a>
                            </div>
                        </div>
                    </div>


                    <div class="widget">
                        <h3 class="title">分类</h3>
                        <!--循环显示课程分类数量-->
                        <ul class="category-list" v-for="(typeStatistics, i) in articleTypeStatistics">
                            <li class="category-list-item">
                                <a class="category-list-link" :href="'blogsort.html?' + typeStatistics.id + '###' + typeStatistics.typeName" target="_blank">
                                    <i class="fa" aria-hidden="true">
                                        {{typeStatistics.typeName}}
                                    </i>
                                </a>
                                <span class="category-list-count">
                                    {{typeStatistics.count}}
                                </span>
                            </li>
                            <br/>
                        </ul>
                    </div>

                    <div class="widget">
                        <h3 class="title">归档</h3>
                        <ul class="archive-list" v-for="(timeStatistics, i) in articleTimeStatistics">
                            <li class="archive-list-item">
                                <a class="archive-list-link" :href="'archives.html?' + timeStatistics.id" target="_blank">
                                    <i class="fa" aria-hidden="true">
                                        {{timeStatistics.articleName}}
                                    </i>
                                </a>
                                <span class="archive-list-count">
                                    {{timeStatistics.updateTime}}
                                </span>
                            </li>
                        </ul>
                    </div>

                    <div class="widget">
                        <h3 class="title">友情链接</h3>
                        <div class="content friends-link" v-for="(friendUrl, i) in friendAddress">
                            <a :href="friendUrl.address" class="fa" target="_blank">{{friendUrl.name}}</a>
                        </div>
                    </div>

                </aside>

            </div>
        </div>
    </section>
    <footer class="main-footer">
        <div class="container">
            <div class="row">
            </div>
        </div>
    </footer>

    <a id="back-to-top" class="icon-btn hide">
        <i class="fa fa-chevron-up"></i>
    </a>

    <div class="copyright">
        <div class="container">
            <div class="row">
                <div class="col-sm-12">
                <span>Copyright &copy; 2021 - 2012
                </span> |
                    <span>
                    Powered by Colin
                </span> |
                    <span>
                    鄂ICP备20013491号-1
                </span>
                </div>
            </div>
        </div>
    </div>

</div>
<script src="static/js/jquery.min.js"></script>
<script src="static/js/bootstrap.min.js"></script>
<script src="static/js/bootstrap-hover-dropdown.min.js"></script>
<script src="static/js/search.js"></script>
<!-- 引入共用js文件 -->
<script src="static/js/common.js"></script>
<script async src="static/js/busuanzi.pure.mini.js"></script>
<script src="static/js/app.js"></script>
<script src="static/js/jquery.fancybox.js"></script>

<!-- 引入VUE -->
<script src="static/js/vue.js"></script>

<!-- CDN引入外部资源axios:用来做请求发送的 -->
<script src="https://cdn.bootcss.com/axios/0.18.0/axios.min.js"></script>

<!-- 引入样式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script type="text/javascript">
    //使用Vue
    let app = new Vue({
        //挂载点
        el: '#app',
        //数据区
        data: {
            //文章列表
            articleList: [],
            articleTypeStatistics: [],
            articleTimeStatistics: [],
            friendAddress: [],//友情链接
            paramObj: {},
            time: 'all'
        },
        //编写函数方法的地方
        methods: {
            //获取归档文章信息
            getBlogGdList() {
                //获取地址栏URL路径
                let url = location.href;
                if(url.indexOf("?") != -1){
                    //如果有问题，说明是从右侧归档栏位点击某个时间点进入本页面的
                    let param = url.substr(url.indexOf("?") + 1);
                    //对中文进行编码,否则会出现乱码问题
                    param = decodeURIComponent(param);
                    //获取到日期字符串，如：2021年12月
                    this.time = param;
                }
                //向后台发请求，获取文章按日期分组数据
               axios.get(getBaseUrl() + '/html/blogArticle/getBlogGdList/'+ this.time, null).then(result => {
                    console.log(result)
                    this.articleList = result.data.data;
                }).catch(error => {
                    console.log(error);
                });
            },
            //统计每个文章分类下面文章的数量
            selectArticleTypeStatistics() {
                axios.get(getBaseUrl() + '/html/blogArticleType/selectArticleTypeStatistics', null).then(result => {
                    this.articleTypeStatistics = result.data.data;
                }).catch(error => {
                    console.log(error);
                });
            },
            //按照文章发布时间分组统计数量
            selectArticleTimeStatistics() {
                axios.get(getBaseUrl() + '/html/blogArticle/selectArticleTimeStatistics', null).then(result => {
                    console.log(result)
                    this.articleTimeStatistics = result.data.data;
                }).catch(error => {
                    console.log(error);
                });
            },
            //按照文章发布时间分组统计数量
            getAllParam() {
                axios.get(getBaseUrl() + '/html/blogParam/getAllParam', null).then(result => {
                    console.log(result)
                    this.paramObj = JSON.parse(result.data.data);//JSON字符串转JSON对象
                }).catch(error => {
                    console.log(error);
                });
            },
            //获取友情链接信息
            getBlogFriendAddress() {
                axios.get(getBaseUrl() + '/html/blogFriendAddress/list', null).then(result => {
                    this.friendAddress = result.data.data;
                }).catch(error => {
                    console.log(error);
                });
            },
        },
        //钩子函数
        mounted() {
            //获取归档文章信息
            this.getBlogGdList();
            //统计每个文章分类下面文章的数量
            this.selectArticleTypeStatistics();
            //按照文章发布时间分组统计数量
            this.selectArticleTimeStatistics();
            //获取所有参数信息
            this.getAllParam();
            //获取友情链接信息
            this.getBlogFriendAddress();
        }
    })
</script>

</body>
</html>